<template>
    <div class="card-box">
        <template>
            <el-dialog :visible.sync="dialogVisible"  width="900px" title="预算调整申请详细信息" :close-on-click-modal="false">
                <div class="card-title">
                    <span>预算调整申请详情</span>
                </div>
                <table class="customTable" cellspacing="0" align="center">
                    <tr>
                        <td class="label">预算编号：</td>
                        <td>{{budgetApply.budgetCode}}</td>
                        <td class="label">申请名称：</td>
                        <td>{{budgetApply.applyName}}</td>
                    </tr>
                    <tr>
                        <td class="label">申请部门：</td>
                        <td>{{applyDept2}}</td>
                        <td class="label">申请类型：</td>
                        <td>{{applyType2}}</td>
                    </tr>
<!--                    <tr>-->
<!--                        <td class="label">原预算额(元)：</td>-->
<!--                        <td colspan="3">-->
<!--                            {{budgetApply.budgetSum}}-->
<!--                        </td>-->
<!--                    </tr>-->
<!--                    <tr>-->
<!--                        <td class="label">调整后预算额(元)：</td>-->
<!--                        <td colspan="3">-->
<!--                            {{budgetApply.budgetSum2}}-->
<!--                        </td>-->
<!--                    </tr>-->
<!--                    <tr>-->
<!--                        <td class="label">预算变化(元)：</td>-->
<!--                        <td colspan="3">-->
<!--                            {{budgetApply.changeAmount}}-->
<!--                        </td>-->
<!--                    </tr>-->
                    <tr>
                        <td class="label">费用说明：</td>
                        <td colspan="3">
                            {{budgetApply.remarks}}
                        </td>
                    </tr>
                </table>
                

                <el-table
                    :data="itemValueList"
                    class="flowTable mt20"
                    row-key="itemId"
                    default-expand-all
                    :tree-props="{children: 'children', hasChildren: 'hasChildren'}">
                    <el-table-column className="weight" header-align="center" prop="itemName" label="科目" width="300">
                        <template slot-scope="scope">
                            <span style="margin-left: 10px">{{ scope.row.itemName }}</span>
                        </template>
                    </el-table-column>
                    <el-table-column align="center" label="原金额(元)">
                        <el-table-column  align="center" prop="itemValue" :label="`${budgetApply.budgetSum}`"/>
                    </el-table-column>
                    <el-table-column align="center" label="调整后金额(元)">
                        <el-table-column  align="center" prop="itemValuePre" :label="`${budgetApply.budgetSum2 || '暂无数据'}`"/>
                    </el-table-column>
                    <el-table-column align="center" label="变化金额(元)">
                        <el-table-column  align="center" prop="itemValue" :label="`${budgetApply.changeAmount || '暂无数据'}`">
                            <template slot-scope="scope">
                            {{`${scope.row.changeAmount>0 ? '+':''}${scope.row.changeAmount || 0}`}}
                            </template>
                        </el-table-column>  
                    </el-table-column>
                </el-table>

                <fileUpload  type="preview" :busId="fileId" :fileId="fileId2" v-if="dialogVisible && showUpload"/>

                <fileUpload  type="preview" :busId="fileId3" :fileId="fileId4" firstTitle="预算申请附件材料" secondTitle="预算申请业务依据"  v-if="dialogVisible && showUpload"/>

                <br/>
                <br/>
                <br/>
                <div class="card-title">
                    <span>办理结果信息</span>
                </div>
                <div style="margin: 0 auto;padding: 0;">
                    <el-table
                        :data="assessInfoDataTwo"
                        class="flowTable"
                        stripe
                        :header-cell-style="tableHeaderColor"
                        style="width: 100%">
                        <el-table-column label="业务类型" prop="busiType" align="center" width="100"/>
                        <el-table-column label="任务名称" prop="taskName" align="center" width="90"/>
                        <el-table-column label="办理结果" prop="operResult" align="center" width="90"/>
                        <el-table-column label="办理意见" prop="operIdea" align="center" width="150"/>
                        <el-table-column label="经办人" prop="operateName" align="center" width="90"/>
                        <el-table-column label="经办时间" prop="operateTime" align="center" width="150"/>
                    </el-table>
                </div>
                <div slot="footer" class="dialog-footer">
                    <el-button @click="closeDialog()">取 消</el-button>
                </div>
            </el-dialog>
        </template>
    </div>
</template>

<script>
    import {mapState} from 'vuex'
    import {getTaskResultByTaskCode,getById,qingjia} from "~/views/wy-flow/api/flowbusimain"
    import axios from 'axios'
    import dbl from '@/utils/dbl'
    import { getDict } from "~/utils";
    import uploadMedia from '@/components/upload-media'
    import { getBudgetApply, getItem, getItem2} from "@/views/wy-budget/api/budgetapply.js";
    import { getFiles, checkFiles, delFiles } from "@/views/wy-budget/api/fileoperation.js";
    import BaseLoad from '@/assets/vue-mixin/BaseLoad'
    import fileUpload from '@/views/wy-budget/components/fileUpload'

    export default {
        name:"view-lookbudgetedit",
        mixins: [BaseLoad],
        components: {uploadMedia,fileUpload},
        data() {
            return {
                showUpload: false,
                fileId:'',
                fileId2:'',
                fileId3:'',
                fileId4:'',
                infoEdit: [true],
                infoEdit2: [true],
                loading: false,
                dialogVisible: false,
                assessInfoDataTwo: [
                ],
                enheng: {
                },
                countys:[
                    {value:"1",text:"手动"},
                    {value:"0",text:"自动"},
                ],
                busiTypeCodes:[],
                rowValue:'',
                rowName:"",
                hideId:false,

                isShow: false,
                fileList: [],
                modelType: "budgetApply",
                busId: "",
                busId2: "",
                budgetApply: {},
                itemValueList: [],
            }
        },
        computed: {
            ...mapState({
                user: state => state.user.user
            }),

            applyDept2: function () {
                let types = getDict('budget_department')
                let pv = this.budgetApply.applyDept
                if (pv && types.length > 0) {
                    const pts = types.filter(t => t.value == pv)
                    return pts ? pts[0].label : ''
                }
                return ''
            },

            applyType2: function () {
                let types = getDict('budget_type')
                let pv = this.budgetApply.applyType
                if (pv && types.length > 0) {
                    const pts = types.filter(t => t.value == pv)
                    return pts ? pts[0].label : ''
                }
                return ''
            }

        },
        created: function(){
            // this.getSelectData()
        },
        methods: {
            tableHeaderColor({row,column,rowIndex,columnIndex}){
                return 'background-color:#FAFAFA;color:black;'
            },
            show(rowData){
                this.loading = false

                // 预算申请业务逻辑
                getBudgetApply(rowData).then(respData => {

                    this.budgetApply = respData.data.data

                    this.fileId = this.budgetApply.fileId
                    this.fileId2 = this.budgetApply.fileId2
                    this.fileId3 = this.budgetApply.applyFileId
                    this.fileId4 = this.budgetApply.applyFileId2
                    this.showUpload = true


                    this.initItem(this.budgetApply.applyId);

                    // this.busId = respData.data.data.fileId;
                    // this.$refs.myApply.getFiles(this.busId);
                    //
                    // this.busId2 = respData.data.data.applyFileId;
                    // this.$refs.myApply2.getFiles(this.busId2);
                }).catch(e => {

                })

                this.assessInfoDataTwo=[]
                getTaskResultByTaskCode(rowData).then(response=>{
                    for(var i=0;i<response.data.data.length;i++){
                        this.assessInfoDataTwo.push(Object.assign({},response.data.data[i]))
                        this.assessInfoDataTwo[i].isAuto=({value:"1",text:"自动"}, {value:"0",text:"手动"})
                        // this.assessInfoDataTwo[i].operResult=({value:0,text:"不通过"},{value:1,text:"通过"},{value:9,text:"返回受理"})
                        if(this.assessInfoDataTwo[i].operResult==1){
                            this.assessInfoDataTwo[i].operResult='通过'
                        }else if (this.assessInfoDataTwo[i].operResult==0){
                            this.assessInfoDataTwo[i].operResult='不通过'
                        }else if (this.assessInfoDataTwo[i].operResult==9){
                            this.assessInfoDataTwo[i].operResult='返回受理'
                        }
                    }
                })
                this.dialogVisible = true
            },
            closeDialog(){
                this.dialogVisible = false
            },
            // 科目
            initItem () {
                getItem2(this.budgetApply.applyId).then(rep => {
                    let rspD = rep.data.data
                    if (rspD) {
                        rspD = rspD.map((rs, index) => {
                            rs['sortNum'] = index + 1
                            return rs
                        })
                    }
                    this.itemValueList = rspD
                })
            },

            initItem2 () {
                getItem2(this.budgetApply.applyId).then(rep => {
                    let rspD = rep.data.data
                    if (rspD) {
                        rspD = rspD.map((rs, index) => {
                            rs['sortNum'] = index + 1
                            return rs
                        })
                    }
                    this.itemValueList = rspD
                })
            },

            // 下载
            handleClean (file) {
                this.$confirm("此操作将永久删除该文件, 是否继续?", "提示", {
                    confirmButtonText: "确定",
                    cancelButtonText: "取消",
                    type: "warning"
                })
                    .then(() => {
                        delFiles(file.fileId, this.modelType).then(resp => {
                            if (resp.data.code === 0) {
                                this.$message({
                                    type: "success",
                                    message: "删除成功!"
                                });

                                this.fileList = this.fileList.filter(
                                    file => file.fileId != fileId
                                );
                            } else {
                                this.$message({
                                    type: "error",
                                    message: "删除失败!"
                                });
                            }
                        });
                    })
                    .catch(() => {
                        this.$message({
                            type: "info",
                            message: "已取消删除"
                        });
                    });
            },
        }
    }
</script>
<style scoped lang='scss'>
    
    @include formWrap();
    .card-box{
        .card-title{
            margin-bottom: 20px;
        }
    }

    //表头结算样式
    .header {
        height: 74px;
        text-align: center;
        margin: 0 auto;
        width: 99%;
        /* max-width: 99%; */

        .subject {
            font-size: 10px;
            width: 25%;
            height: 74px;
            line-height: 74px;
            text-align: left;
            border: 1px solid #EBEEF5;

            font-weight: 700;
            padding-left: 20px;
            float: left;
        }

        .aggregate {
            height: 74px;
            float: right;
            width: 75%;

            .aggregatebox {
                height: 50%;
                width: 100%;

                .etui {
                    font-size: 10px;
                    border: 1px solid #EBEEF5;
                    width: 33.33%;
                    height: 100%;
                    line-height: 36px;
                    text-align: center;
                    font-weight: 700;
                    float: left;

                }

                .etui /deep/ .el-form-item__content {

                    margin-left: 0 !important;
                }

                // background-color: yellow;
            }
        }
    }

    // 树形结构修改默认样式
    .custom-tree-node {
        flex: 1;
        display: flex;
        align-items: center;
        justify-content: space-between;
        /* font-size: 14px; */
        font-size: 10px;
    ;
        padding-right: 8px;

    }

    .box /deep/.el-tree-node__content {
        height: 53px;
    }

    // 修改开关组件
    .box /deep/.el-switch__core {
        height: 14px;
    }

    //修改开关组件原型开关
    .box /deep/.el-switch__core::after {
        height: 12px;
        width: 12px;
        margin-left: 0px;
        top: 0;
    }

    // 修改开关组件切换后样式
    .box /deep/ .el-switch.is-checked .el-switch__core::after {
        margin-left: -14px;
        top: 0;

    }

    //
    .inputbox {
        text-align: center;
    }

    //修改树形组件 输入框样式
    .inputbox /deep/ .el-input__inner {
        height: 25px;
        width: 50%;

    }

    .footer /deep/.el-button {
        float: right;
        margin-right: 5px;
    }
</style>
